<template>
    <van-field
        :value="value"
        @input="changeinput"
        :name="name"
        :type="type"
        :label="label"
        :placeholder="placeholder"
        :rules="rules"
        clearable
        :left-icon="leftIcon"
        :right-icon="type=='password'?'closed-eye':'eye'"
        @click-right-icon="changeType"
        @blur="changeblur"
    />
</template>

<script>
    export default {
        model:{  //组件是使用v-model 
            prop:'value',   // 父改子 
            event:'changevalue'  // 子改父 
        },
        data(){
            return {
                type:'password'
            }
        },
        props:{
            value:String, 
            label:String,
            placeholder:String,
            rules:Array,
            leftIcon:{
                type:String,
                default:"lock"
            },
            name:String, 
        },
        methods:{
        changeType(){
            this.type = (this.type=='password'?'text':'password')
        },
        changeinput(value){
            console.log(value)
            this.$emit("changevalue",value)
        },
        changeblur(e){
            this.$emit("blur",e.target.value)
        }
    }
}
</script>